<template>
  <div>
    <a-card :bordered="false" class="space-m-b box-shadow box-radius" :bodyStyle="{paddingBottom:0}">
      <div class="table-page-search-wrapper">
        <a-form-model layout="inline" :model="queryParam" ref="queryParam">
          <a-row :gutter="15">
            <a-col :md="7" :sm="12">
              <a-form-model-item prop="inHospitalCode">
                <a-select
                  placeholder="请选择转入机构"
                  v-model="queryParam.inHospitalCode"
                >
                  <a-select-option
                    :value="item.value"
                    v-for="(item, index) in rollOrganizationList"
                    :key="index">{{ item.label }}</a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :md="7" :sm="12">
              <a-form-model-item prop="outHospitalCode">
                <a-select
                  placeholder="请选择转出机构"
                  v-model="queryParam.outHospitalCode"
                >
                  <a-select-option
                    :value="item.value"
                    v-for="(item, index) in rollOrganizationList"
                    :key="index">{{ item.label }}</a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :md="6" :sm="24">
              <a-form-model-item prop="searchKey">
                <a-input placeholder="患者姓名/身份证号" v-model="queryParam.searchKey"/>
              </a-form-model-item>
            </a-col>
            <a-col :md="4" :sm="24">
              <a-form-model-item>
                <span class="table-page-search-submitButtons">
                  <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
                  <a-button style="margin-left: 8px" @click="resetForm" >重置</a-button>
                </span>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </div>
    </a-card>
    <a-card :bordered="false" class="box-shadow box-radius">
      <s-table
        size="default"
        ref="table"
        :rowKey="(record,index) => index"
        :columns="columns"
        :data="loadData"
        :pagination="pagination"
        defaultSort=""
        :scroll="{ x: true}"
      >
        <span slot="patientGender" slot-scope="text">
          {{ text | patientGenderFilter }}
        </span>
        <span slot="patientMedicareType" slot-scope="text">
          {{ text | patientMedicareTypeFilter }}
        </span>
        <span slot="action" slot-scope="text, record">
          <a @click="handleViewCase(record), '电子病历'">查看病历</a>
          <a-divider type="vertical" />
          <a @click="handleReports(record, '报到')">报到</a>
        </span>
      </s-table>
      <apply-modal ref="modal" from="report" @ok="handleUpdateOk" />
      <rollin-case-modal ref="modalcase" @ok="handleUpdateOk" />
    </a-card>
  </div>
</template>

<script>
import { STable } from '@/components'
import { refInData } from '@/api/referral'
import ApplyModal from './apply/ApplyModal.vue'
import RollinCaseModal from './modules/RollinCaseModal'
import { checkPermission } from '@/utils/permissions'
import { getHospitalInfo } from '@/utils/dict'

export default {
  name: 'TableList',
  components: {
    STable,
    ApplyModal,
    RollinCaseModal
  },
  data () {
    return {
      // checkStatusList,
      rollOrganizationList: [],
      // 查询参数
      queryParam: {
        inHospitalCode: undefined,
        outHospitalCode: undefined,
        searchKey: '',
        isReport: '0'
      },
      form: this.$form.createForm(this),
      pagination: {
        showSizeChanger: true, // 显示可改变每页数量
        showQuickJumper: true,
        showTotal: total => `共 ${total} 条记录`, // 显示总数
        pageSizeOptions: ['1', '10', '20', '30', '40', '50'] // 每页数量选项
      },
      permissions: [],
      // 表头
      columns: [
        {
          title: '患者姓名',
          dataIndex: 'patientName'
        },
        {
          title: '身份证号',
          dataIndex: 'patientIdcard'
        },
        {
          title: '性别',
          dataIndex: 'patientGender',
          scopedSlots: { customRender: 'patientGender' }
        },
        {
          title: '医保类型',
          dataIndex: 'patientMedicareType',
          scopedSlots: { customRender: 'patientMedicareType' },
          ellipsis: false
        },
        {
          title: '转出机构',
          dataIndex: 'outHospitalName',
          ellipsis: false
        },
        {
          title: '转入机构',
          dataIndex: 'inHospitalName',
          ellipsis: false
        },
        {
          title: '转入科室',
          dataIndex: 'inDeptName'
        },
        {
          title: '转入医生',
          dataIndex: 'inDoctorName'
        },
        {
          title: '审核时间',
          dataIndex: 'outTime',
          sorter: false
        },
        {
          title: '初步诊断',
          dataIndex: 'primaryDiagnosis'
        },
        {
          title: '转诊原因',
          dataIndex: 'outReason'
        },
        {
          title: '操作',
          // width: this.editEnabel ? '200px' : '100px',
          dataIndex: 'action',
          scopedSlots: { customRender: 'action' },
          fixed: 'right'
        }
      ],
      // 加载数据方法 必须为 Promise 对象
      loadData: parameter => {
        console.log('queryParam', this.queryParam)
        return refInData(Object.assign({}, parameter, this.queryParam)).then((res) => {
          if (res.code === 200) {
            return res.data
          } else {
            this.$message.error(res.message)
          }
        }).catch((err) => {
          this.$message.error(err.message)
        })
      },
      addEnable: checkPermission('system:dict:add'),
      editEnabel: true, // checkPermission('rolloutManage:rolloutCheck:edit'),
      removeEnable: checkPermission('system:dict:remove')
    }
  },
  // filters: {
  //   statusFilter (type) {
  //     return checkStatusList[Number(type)].text
  //   },
  //   statusTypeFilter (type) {
  //     return checkStatusList[Number(type)].status
  //   },
  //   hospitalTurnFilter (type) {
  //     return hospitalTurnDict[type].text
  //   }
  // },
  created () {
    const that = this
    getHospitalInfo().then((res) => {
      that.rollOrganizationList = res
    }).catch((err) => {
      that.$message.error('医院字典服务出错,请稍后重试！')
      console.log(err)
    })
  },
  methods: {
    resetForm () {
      this.$refs['queryParam'].resetFields()
      this.$refs.table.refresh(true)
    },
    // outHospitalChange (value) {
    //   this.queryParam.outHospitalCode = value
    // },
    // radioChange (e) {
    //   // console.log('radio checked', e.target.value)
    // },
    handleViewCase (record, title) {
      this.$refs.modalcase.view(record, title)
    },
    handleUpdateOk () {
      this.$refs.table.refresh(true)
    },
    handleReports (record, title) {
      this.$refs.modal.reports(record, title)
    }
  },
  watch: {
  }
}
</script>
